import styled from "styled-components";
import { primaryColor } from '../../static/config/color';
import personbg from '../../static/img/personbg.png';
export const InforBoxDom = styled.div`
  height: 4rem;
  background: ${primaryColor};
  padding:0rem .3rem;
  background:url(${personbg}) no-repeat;
  background-size:100% 3.52rem;
  position:relative;
  .userBox{
    width: 6.9rem;
    height: 2rem;
    padding:.3rem;
    background: rgba(255, 255, 255, 0.9);
    -webkit-box-shadow: 0px 0.04rem 0.6rem 0px rgb(89 49 5 / 10%);
    box-shadow: 0px 0.04rem 0.6rem 0px rgb(89 49 5 / 10%);
    border-radius: 0.16rem;
    position: absolute;
    top: 1.48rem;
    left: 50%;
    margin-left: -3.45rem;
    display:flex;
    justify-content:space-between;
    align-items:center
  }
     .imgBox{
    width:1.2rem;
    height:1.2rem;
    border:0.02rem solid #dedded;
    border-radius:1rem;
    overflow: hidden;
    margin-right:.2rem
   }  
   .userInfo{
     flex:1;
     width:14rem;
     height:1rem;
     display:flex;
     flex-direction:column;
     .name{
       font-size:14px;
       color:#333333;
       margin-bottom:.2rem;
     }
     .phone{
       font-size:12px;
       color:#666666;
       opacity:.8;
     }
   }
`;
